<script setup>
import { getGenTable, updateGenTableNoValidated } from "@/api/tool/gen";
import { listTemplate } from "@/api/tool/genconfigtemplate";
const props = defineProps({
  id: {
    type: [Number, String],
    default: ""
  }
});

const formRef = ref();
const data = ref({
  loading: false,
  form: {
    id: props.id
  },
  info: {},
  tableList: {},
  // 模版
  templateListOptions: []
});

onMounted(() => {
  if (data.value.form.id != "") {
    getInfo();
    listTemplate().then((response) => {
      data.value.templateListOptions = response.data.list;
    });
  }
});

function getInfo() {
  data.value.loading = true;
  getGenTable(data.value.form.id).then((res) => {
    data.value.loading = false;
    data.value.info = res.data.info;
    const tableList = res.data.rows;
    tableList.forEach((e) => {
      e.isInsert = e.isInsert === "1";
      e.isEdit = e.isEdit === "1";
      e.isList = e.isList === "1";
      e.isNewRow = e.isNewRow === "1";
      e.isQuery = e.isQuery === "1";
      e.isUnique = e.isUnique === "1";
      e.isLog = e.isLog === "1";
      e.isRequired = e.isRequired === "1";
      e.colCheck =
        e.colCheck !== "" && e.colCheck !== null ? e.colCheck.split(",") : [];
    });
    data.value.tableList = tableList;
  });
}

defineExpose({
  submit(callback) {
    var genTable = data.value.info;
    const tableList = data.value.tableList;
    console.log(tableList);
    tableList.forEach((e) => {
      e.isInsert = e.isInsert ? "1" : "0";
      e.isEdit = e.isEdit ? "1" : "0";
      e.isNewRow = e.isNewRow ? "1" : "0";
      e.isList = e.isList ? "1" : "0";
      e.isQuery = e.isQuery ? "1" : "0";
      e.isUnique = e.isUnique ? "1" : "0";
      e.isLog = e.isLog ? "1" : "0";
      e.isRequired = e.isRequired ? "1" : "0";
      e.colCheck = e.colCheck.join(",");
    });
    genTable.columns = tableList;
    genTable.params = {
      treeCode: genTable.treeCode,
      treeName: genTable.treeName,
      treeParentCode: genTable.treeParentCode,
      parentMenuId: genTable.parentMenuId,
      menuIcon: genTable.menuIcon,
      attachOption: genTable.attachOption,
      disableEnableOption: genTable.disableEnableOption
    };
    updateGenTableNoValidated(genTable).then((res) => {
      if (res.code == 200) {
        ElMessage.success({
          message: res.msg,
          center: true
        });
      }
      callback && callback();
    });
  }
});

function functionAuthorChange() {
  const option = data.value.templateListOptions.filter(
    (item) => data.value.info.templateName === item.id
  );
  if (option.length > 0) {
    const optionValue = option[0];
    data.value.info.templateName = optionValue.templateName;
    data.value.info.functionAuthor = optionValue.functionAuthor;
    data.value.info.functionAuthorEmail = optionValue.functionAuthorEmail;
    data.value.info.workspacePath = optionValue.workspacePath;
    data.value.info.moduleName = optionValue.moduleName;
    data.value.info.packageName = optionValue.packageName;
    data.value.info.webWorkspacePath = optionValue.webWorkspacePath;
  }
}
</script>

<template>
  <div v-loading="data.loading">
    <el-form
      ref="formRef"
      :model="data.info"
      label-width="120px"
      label-suffix=" "
      label-position="top"
      style="padding: 0 20px"
    >
      <el-row :gutter="30">
        <el-col :span="8">
          <el-form-item label="表名称" prop="tableName">
            <el-input placeholder="请输入表名称" v-model="data.info.tableName"
          /></el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="表描述" prop="tableComment">
            <el-input
              placeholder="请输入表描述"
              v-model="data.info.tableComment"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="实体类名称" prop="className">
            <el-input
              placeholder="请输入表描述"
              v-model="data.info.className"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="8">
          <el-form-item label="生成类型" prop="tplCategory">
            <el-select
              v-model="data.info.tplCategory"
              placeholder="选择生成类型"
            >
              <el-option value="crud" label="单表CRUD" selected></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="生成模版" prop="templateName">
            <el-select
              v-model="data.info.templateName"
              @change="functionAuthorChange"
            >
              <el-option
                v-for="item in data.templateListOptions"
                :key="item.id"
                :label="item.templateName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="作者" prop="functionAuthor">
            <el-input placeholder="作者" v-model="data.info.functionAuthor" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="8">
          <el-form-item label="邮箱" prop="functionAuthorEmail">
            <el-input
              placeholder="邮箱"
              v-model="data.info.functionAuthorEmail"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="后端路径" prop="workspacePath">
            <el-input
              placeholder="后端路径"
              v-model="data.info.workspacePath"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="前端路径" prop="webWorkspacePath">
            <el-input
              placeholder="前端路径"
              v-model="data.info.webWorkspacePath"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="8">
          <el-form-item label="模块名" prop="moduleName">
            <el-input placeholder="模块名" v-model="data.info.moduleName" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="包路径" prop="packageName">
            <el-input placeholder="包路径" v-model="data.info.packageName" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="功能名" prop="functionName">
            <el-input placeholder="功能名" v-model="data.info.functionName" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="8">
          <el-form-item label="业务名" prop="businessName">
            <el-input placeholder="业务名" v-model="data.info.businessName" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="代码方式" prop="genType">
            <el-radio-group placeholder="包路径" v-model="data.info.genType">
              <el-radio label="0">zip压缩包</el-radio>
              <el-radio label="1">自定义路径</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
